<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<div class="table-scrollable">
	<div style="margin-top: 30px;"></div>
	<table class="table table-striped table-hover table-info">
		<thead>
			<tr>
				<th style="width: 15%;">产品名称</th>
				<th style="width: 15%;">我司货号</th>
				<th style="width: 15%;">分类</th>
				<th style="width: 10%;">单位</th>
				<th style="width: 10%;">状态</th>
				<th style="width: 20%;">操作</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${page.result}" var="product" varStatus="vs">
				<tr>
					<td class="showTd"><c:choose>
							<c:when test="${fn:length(product.name)>20 }">
							  ${fn:substring(product.name, 0, 20)}... 
							  <!-- 隐藏DIV -->
								<div class="modal-content div-hidden">${product.name }</div>
							</c:when>
							<c:otherwise>
							${product.name}
						</c:otherwise>
						</c:choose></td>
					<td class="showTd"><c:choose>
							<c:when test="${fn:length(product.code)>20 }">
							  ${fn:substring(product.code, 0, 20)}... 
							  <!-- 隐藏DIV -->
								<div class="modal-content div-hidden">${product.code }</div>
							</c:when>
							<c:otherwise>
							${product.code}
						</c:otherwise>
						</c:choose></td>
					<td class="showTd"><c:choose>
							<c:when test="${fn:length(product.productType.name)>20 }">
							  ${fn:substring(product.productType.name, 0, 20)}... 
							  <!-- 隐藏DIV -->
								<div class="modal-content div-hidden">${product.productType.name }</div>
							</c:when>
							<c:otherwise>
							${product.productType.name}
						</c:otherwise>
						</c:choose></td>
					<td>${product.util }</td>
					<td>${product.productStatus.name }</td>
					<td style="text-align: center;"><a href="javascript:;"
						class="btn btn-sm yellow"
						onclick="update('/product/product?id=${product.id}&show=show')">
							<i class="fa fa-file-text">&nbsp;查看</i>
					</a> <a href="javascript:;" class="btn btn-sm blue"
						onclick="update('/product/product?id=${product.id}')"> <i
							class="fa fa-edit">&nbsp;编辑</i>
					</a> <%-- <a href="javascript:;" style="display: none;"
						class="btn btn-sm green"
						onclick="add('/product/productShelves?id=${product.id}')"> <i
							class="fa fa-hand-o-up">&nbsp;上架</i>
					</a> --%>
				</tr>
			</c:forEach>
		</tbody>
	</table>
</div>
<div class="pageination-panel">${page}</div>
<!-- <div class="modal fade" id="menuModal" tabindex="-1" role="basic"
	aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true"></button>
				<h4 class="modal-title">请选择上架店铺</h4>
			</div>
			<div class="modal-body">
				<div style="margin: 0 auto; padding: 3% 3% 3% 5%;">
					<input type="checkbox" /><span>eBay</span><br> <br> <input
						type="checkbox" /><span>亚马逊</span>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn blue" onclick="addP()">选择并继续下一步</button>
				<button type="button" class="btn blue" data-dismiss="modal">取消</button>
			</div>
		</div>
	</div>
</div> -->
<script type="text/javascript">
	$('.div-hidden').hide();
	$(".showTd").mouseleave(function() {
		$(this).find('div').hide();
	})
	$(".showTd").mouseover(function() {
		//alert($(this).find('div').html());
		$(this).find('div').show();
	});
	function getOption(data) {
		alert(data);
		add('/product/productShelves?product=' + data);
	}
</script>